
.previewWrap {
    position: relative;
    height: 100vh;
    width: 7.5rem;

    :global {
        ul.slick-dots {
            position: absolute;
            bottom: .06rem;
            background-color: inherit;

            li {
                button {
                    width: 8px;
                    height: 8px;
                }
            }

            li.slick-active {
                button {
                    background: #D32F2F;
                }
            }
        }
    }

    .main {
        background: black;

        .img {
            width: 7.5rem;
            display: flex;
            align-items: flex-end;
            height: 100vh;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            box-sizing: border-box;

            .text {
                color: white;
                height: 2.9rem;
                width: 100%;
                padding: 0 .3rem;
                padding-top: .35rem;
                background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);

                .desc {
                    font-size: .28rem;
                    word-break: break-all;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 3;
                    overflow: hidden;
                }
            }
        }
    }
}
